import { history } from '@/.umi/core/history';
import { loginUser } from '@/pages/login/cookie';
import { Homework, PersonageGrade } from '@/pages/login/service';
import {
  Col,
  Row,
  Descriptions,
  Form,
  Table,
  Input,
  Button,
  Spin,
  message,
} from 'antd';
const { TextArea } = Input;
import React, { useState } from 'react';
import request from '../../../../../http';
interface Student {
  studentName: any;
  sex: any;
  studentNumber: any;
  collegesName: any;
  courseName: any;
  majorName: any;
  teaName: any;
  teacherName: any;
  teamName: any;
  position: any;
}

export default function index(Props: any) {
  const columns = [
    {
      title: '作业主题',
      dataIndex: 'title',
    },
    {
      title: '下发老师',
      dataIndex: 'teachName',
    },
    {
      title: '下发时间',
      dataIndex: 'createTime',
    },
    {
      title: '提交时间',
      dataIndex: 'completeDate',
    },
    {
      title: '实际提交时间',
      dataIndex: 'completeTime',
    },
    {
      title: '提交情况',
      dataIndex: 'submission',
    },
    {
      title: '作业得分',
      dataIndex: 'jobScore',
    },
    {
      title: '操作',
      dataIndex: 'tags',
      key: 'tags',
      render: (text: any, record: any) => (
        <>
          <Button
            type="link"
            onClick={() => {
              Homework.saveHomeworkIds({ id: record.id, role: 2 });
              history.push('/global/homework/details');
            }}
          >
            详情
          </Button>
        </>
      ),
    },
  ];

  const [pagination, setPagination] = React.useState({
    //分页器
    current: 1,
    total: 1,
    pageSize: 10,
    showSizeChanger: true,
    pageSizeOptions: ['5', '10', '50', '200', '500'],
    showQuickJumper: true,
    defaultPageSize: 5,
    // showTotal:(total:any, current:any) => `共 ${total} 条记录  第 ${current[0]}/${current[1]} 页`,
  });

  const [desData, setDesData] = useState<Student>({
    studentName: '',
    sex: '',
    studentNumber: '',
    collegesName: '',
    courseName: '',
    majorName: '',
    teaName: '',
    teacherName: '',
    teamName: '',
    position: '',
  });
  const [data, setdata] = useState();
  const getData = async (pageValue: any, pageSizeValue: any) => {
    await request
      .post(
        '/teacher/Score/ScoringDetails',
        'current=' +
          pageValue +
          '&id=' +
          PersonageGrade.getPersonageGradeId().id +
          '&size=' +
          pageSizeValue,
      )
      .then((response: any) => {
        if (response.code == 200) {
          setspinning(false);
          if (response.data.jobDetails != null) {
            const data = response.data.jobDetails.map(
              (item: any, index: number) => ({
                key: index,
                id: item.id,
                title: item.title,
                completeDate: item.completeDate,
                teachName: item.teachName,
                createTime: item.createTime,
                completeTime: item.completeTime,
                submission: item.submission,
                jobScore: item.jobScore,
              }),
            );
            setdata(data);
          }
          setDesData(response.data);
          const newPageObject = {
            ...pagination,
            current: pageValue,
            pageSize: pageSizeValue,
            total: response.total,
          };
          setPagination(newPageObject);
          form.setFieldsValue({
            grade: response.data.score,
            comment: response.data.comments,
          });
        } else {
          message.error(response.message);
        }
      });
  };

  React.useEffect(() => {
    getData(1, 5);
  }, []);

  const [form] = Form.useForm();
  const pageOnChange = async (page: any) => {
    await getData(page.current, page.pageSize);
  };
  const [spinning, setspinning] = useState(true);
  return (
    <Spin spinning={spinning} size="large">
      <Row justify="center" style={{ marginTop: 30 }}>
        <Col span={22}>
          <Descriptions title="个人综合评分" column={4}>
            <Descriptions.Item label="学生姓名">
              {desData.studentName}
            </Descriptions.Item>
            <Descriptions.Item label="性别">{desData.sex}</Descriptions.Item>
            <Descriptions.Item label="学号">
              {desData.studentNumber}
            </Descriptions.Item>
            <Descriptions.Item label="院系">
              {desData.collegesName}
            </Descriptions.Item>
            <Descriptions.Item label="实训课程">
              {desData.courseName}{' '}
            </Descriptions.Item>
            <Descriptions.Item label="专业">
              {desData.majorName}
            </Descriptions.Item>
            <Descriptions.Item label="实训老师">
              {desData.teacherName}
            </Descriptions.Item>
            <Descriptions.Item label="责任老师">
              {desData.teacherName}
            </Descriptions.Item>
            <Descriptions.Item label="项目组">
              {desData.teamName}
            </Descriptions.Item>
            <Descriptions.Item label="项目角色">
              {desData.position}
            </Descriptions.Item>
          </Descriptions>
        </Col>
        <Col span={22}>
          <Form form={form}>
            <Row gutter={24}>
              <Col span={5}>
                <Form.Item
                  label="综合得分"
                  name="grade"
                  rules={[{ required: true, message: '请输入成绩!' }]}
                >
                  <Input disabled />
                </Form.Item>
              </Col>
              <Col span={22}>
                <Form.Item label="评语" name="comment">
                  <TextArea
                    placeholder="请输入评语!"
                    autoSize={{ minRows: 3, maxRows: 5 }}
                    disabled
                  />
                </Form.Item>
              </Col>
              <Col span={22}>
                <Form.Item>
                  <Button
                    type="primary"
                    htmlType="submit"
                    style={{ marginRight: 10 }}
                    disabled
                  >
                    保存
                  </Button>
                  <Button
                    onClick={() => {
                      history.goBack();
                    }}
                  >
                    返回
                  </Button>
                </Form.Item>
              </Col>
            </Row>
          </Form>
        </Col>
        <Col span={22}>
          <Table
            columns={columns}
            dataSource={data}
            pagination={pagination}
            onChange={pageOnChange} //分页、排序、筛选变化时触发(用以重新获取数据)
          />
        </Col>
      </Row>
    </Spin>
  );
}
